<template>
  <view class="work-container">
    <table-list :listData="listData"></table-list>
    <view class="submit-group">
      <button class="u-button" :ripple="true" @click="handleAdd">新增</button>
    </view>
  </view>
</template>

<script>
import TableList from './components/tableList.vue'
import { reqVisitorManageList } from '@/api/visitor-regist'
export default {
  components: {
    TableList
  },
  data() {
    return {
      isFinished: false,
      pageNum: 1,
      total: null,
      listData: [],
      allSearchParams: {}
    }
  },
  onPullDownRefresh() {
    this.initData()
  },
  onReachBottom() {
    this.pageNum++
    this.getList()
  },
  onShow() {
    this.initData()
  },
  methods: {
    initData() {
      this.pageNum = 1
      this.isFinished = false
      this.getList()
    },
    getList() {
      if (this.isFinished) {
        return
      }

      this.getAll()
    },
    getAll() {
      const req = {
        pageNum: this.pageNum,
        pageSize: 10,
        ...this.allSearchParams
      }
      reqVisitorManageList(req)
        .then((res) => {
          this.listData = this.pageNum === 1 ? res.rows : [...this.listData, ...res.rows]
          this.isFinished = this.listData.length === res.total
        })
        .finally(() => {
          uni.stopPullDownRefresh()
        })
    },
    handleAdd() {
      uni.navigateTo({
        url: '/pages/work/visitor-regist/form'
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.submit-group {
  background: #fff;
  z-index: 9;
  padding: 10px 20px;
}

.u-button {
  width: 800rpx;
  margin: 0 5px;
}
</style>
